<template>
  <div class="condition-node-box" >
    <div class="auto-judge node_8f5e_917f"
        @click="setProperties">
      <div class="sort-left">
        &lt;
      </div><div class="title-wrapper">
        <span
          style="float:right;color: grey;"
          @click.stop="delConditionNode"
        >X</span>
        <span
          class="editable-title"
          data-spm-anchor-id="0.0.0.i35.2f244490ZxXSWD"
        >{{ node.name }}</span>
      </div>
      <div
        class="content"
      >
        <div>{{ text1 }}</div>
      </div>
    </div>
    <AddNodeBtn
      :node="node"
      @addnode="addnode"
    />
    <Condition
      v-if="node.type === 'FILTER'"
      :dialog.sync="dialog"
      :node="node"
      @save="save"
    />
  </div>
</template>
<script>
import AddNodeBtn from './add-node-btn.vue'
import Condition from '../drawer/condition.vue'
export default {
  components: {
    AddNodeBtn,
    Condition
  },
  props: {
    text: {
      type: String,
      default: '请设置筛选条件'
    },
    node: {
      type: Object,
      default: undefined
    }
  },
  data: () => ({
    dialog: false,
    text1: ''
  }),
  mounted () {
    this.text1 = this.getText()
  },
  methods: {
    addnode (node) {
      this.$emit('addnode', node)
    },
    delConditionNode () {
      this.$emit('delConditionNode')
    },
    setProperties () {
      this.dialog = true
    },
    save () {
      this.text1 = this.getText()
      this.$emit('save')
    },
    getText () {
      var text = '请设置筛选条件'
      // if (!this.node.properties) {
      //   return text
      // }
      return text
    }
  }
}
</script>
